<script setup>
import { useStore } from "vuex";

const store = useStore()

const handleOpenChatBot = async () => {
	if (store.getters.getCozeExpiresIn > Math.floor(Date.now() / 1000)) {
		uni.navigateTo({
			url: '/pages/chat/index'
		})
	} else {
		await store.dispatch('setCozeAccessToken')
		uni.navigateTo({
			url: '/pages/chat/index'
		})
	}
	
}

</script>

<template>
	<movable-area class="movable-area">
		<movable-view class="movable-view" direction="all" x="800" y="1200rpx">
			<view
				class="smart-customer-service"
				@click="handleOpenChatBot"
			>
				<image src="@/static/index/customer-service.png" class="icon" />
			</view>
		</movable-view>
	</movable-area>
	
</template>

<style scoped lang="scss">
.movable-area {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 999;
	.movable-view {
		pointer-events: auto;
		width: 240rpx;
		height: 228rpx;
		
		.smart-customer-service {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			width: 100%;
			height: 100%;
			
			.icon {
				width: 100%;
			}
			
			.title {
				color: #FFFFFF;
				line-height: 32rpx;
			}
			
			.coze-icon {
				width: 100%;
				height: 100%;
			}
		}
		
	}
}

</style>
